import Vue from 'vue';
import Echarts  from 'echarts';
import axios from 'axios';
import moment from 'moment';



moment.locale('zh-cn');

Vue.prototype.$gEBI = ::document.getElementById;
Vue.prototype.$echarts = Echarts;
Vue.prototype.$http = axios;
Vue.http = axios;

//import router   from './router';
//import store    from './store';

axios.defaults.baseURL = 'http://47.93.223.173:6183/api';
axios.defaults.withCredentials = true;

// 请求拦截器
axios.interceptors.response.use(async response => {
    // 只有在非校验登录状态的情况下请求接口才拦截
    // 涉及到两个接口
    // 1.  初始化 Vuex 时验证登录状态的 tools_banner/getBannerList?login（加上 login 的 query 是为了强行与正常的接口分开）
    //     其通过判断返回 msg 是否为 Array 类型确认是否登录
    // 2.  登录页面的 /tools_user/login
    //     其通过判断返回 msg 是否为 'Login' 确认登录是否成功
    if (!/login$/.test(response.config.url) && response.data.res_code === -995) {
        await Vue.prototype.$msgbox({message: '由于您太久没有活跃，请重新登陆'});
        return void location.reload();
    }

    return response.data.msg;
});

// 画折线图
Object.assign(Vue.prototype, {
    $showLine(selector, data, name, isHour, xKey = 'date', type = 'line') {
        this.$echarts.init(this.$gEBI(selector)).setOption({
            title : {
                text: `${name} 丶 最近 ${isHour ? '24 小时' : '30 天'}趋势`,
                x:'center',
            },
            xAxis: {
                type: 'category',
                //boundaryGap: false,
                data: data.map(e => e[xKey]),
                axisTick: {
                    alignWithLabel: true
                }
            },
            yAxis: {
                type: 'value'
            },
            series: [{
                data: data.map(e => e.count),
                type,
                barWidth: '30%',
                areaStyle: {},
            }],
        })
    }
});

Vue.mixin({
    filters: {
        time(val) {
            return moment(val).subtract(8, 'hour').format('YYYY-MM-DD hh:mm:ss');
        },
        date(val) {
            return moment(val).subtract(8, 'hour').format('YYYY-MM-DD');
        },
        state(val) {
            return [{id: 1, text: '正常'},{id: -1, text: '假通告'},{id: -2, text: '下架'}].find(state => state.id === val).text;
        },
    }
});
